
<html>
<head>
  <script language="javascript" type="text/javascript" src="//cdn.jsdelivr.net/p5.js/0.3.11/p5.min.js"></script>
  <script language="javascript" type="text/javascript" src="//cdn.jsdelivr.net/p5.js/0.3.11/addons/p5.dom.js"></script>
  <script language="javascript" type="text/javascript" src="sketch.js"></script>
  <style>
    p {
      font-size: 24px;
      padding: 10px;
      width: 50%;
      text-align: center;
    }

    #apple {
      background-color: red; 
    }

    #banana {
      background-color: yellow; 
    }

    #pear {
      background-color: green; 
    }
  </style>
</head>

<body>
  <p>Press 'a', 'b', or 'p' to hide an element.<br/>Press space to show all elements.</p>
  <p id="apple">apple</p>
  <p id="banana">banana</p>
  <p id="pear">pear</p>
</body>

</html>